<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Bootstrap 实例 - 基本的表格</title>
  <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
  <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<button id="delAll">批量删除</button>
<table class="table">
  <thead>
  <tr>
    <th><input type="checkbox"></th>
    <th>ID</th>
    <th>分类名称</th>
    <th>分类图片</th>
    <th>是否显示</th>
    <th>是否热门</th>
  </tr>
  </thead>
  <tbody>
  {foreach $data as $val}
  <tr>
    <td><input type="checkbox"></td>
    <td>{$val.id}</td>
    <td>{$val.name}</td>
    <td>{$val.image}</td>
    <td>{$val.isshow}</td>
    <td>{$val.ishot}</td>
  </tr>
  {/foreach}
  </tbody>
</table>
{$data|raw}
</body>
</html>
<script>
  $('#delAll').click(function (){
    var id=[];
    $('input:checked').each(function (){
      id.push($(this).parents('tr').children().eq(1).html());
    })
    $.ajax({
      url:'delAll',
      data:{id:id},
      dataType:'json',
      type:'get',
      success:function (e){
        if(e.code==200){
          $('input:checked').each(function (){
            $(this).parents('tr').remove()
          })
        }
      }
    })
  })

</script>